<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>requestideclcalback</title>
</head>
<body>
<script>
    const channel = new MessageChannel();
    channel.port2.onmessage = function (e) {
        console.log(e.data); // 接受port2发送过来的消息
    }
    // 将port2发送到另一个线程
    channel.port1.postMessage('hello')
</script>

    <!-- <script>
        // requestIdleCallback(function (deadline) {
        //     console.log(deadline.timeRemaining(), deadline.didTimeout);

        // }, {
        //     timeout: 1000
        // });
        const nums = 60000;
        const arr = [];
        function generateDom() {
            for (let i= 0; i< nums; i++) {

                arr.push(function () {
                    let div = document.createElement('div');
                    div.innerText = i;
                    document.body.appendChild(div);
                });
            }
        }
        generateDom();
        // for ( let i =0; i< nums; i++) {
        //     arr[i]();
        // }

        function workloop (deadline) {
            if (deadline.timeRemaining()> 1 && arr.length> 0) {
                const fn = arr.shift();
                fn();
            }
            requestIdleCallback(workloop);
        }

        requestIdleCallback(workloop);
        

    </script> -->
</body>
</html>